import React from 'react';
import { Card, Row, Col, Statistic } from 'antd';
import {
  AppstoreOutlined,
  FileTextOutlined,
  IdcardOutlined,
  DatabaseOutlined,
  LineChartOutlined
} from '@ant-design/icons';
import './styles.css';

const Overview: React.FC = () => {
  return (
    <div className="overview-container">
      <h2 className="page-title">全域信息管理概览</h2>
      <Row gutter={[16, 16]}>
        <Col xs={24} sm={12} md={8} lg={6}>
          <Card>
            <Statistic
              title="产品目录总数"
              value={156}
              prefix={<AppstoreOutlined />}
              valueStyle={{ color: '#00479d' }}
            />
          </Card>
        </Col>
        <Col xs={24} sm={12} md={8} lg={6}>
          <Card>
            <Statistic
              title="数据资产总数"
              value={892}
              prefix={<DatabaseOutlined />}
              valueStyle={{ color: '#00479d' }}
            />
          </Card>
        </Col>
        <Col xs={24} sm={12} md={8} lg={6}>
          <Card>
            <Statistic
              title="身份认证总数"
              value={328}
              prefix={<IdcardOutlined />}
              valueStyle={{ color: '#00479d' }}
            />
          </Card>
        </Col>
        <Col xs={24} sm={12} md={8} lg={6}>
          <Card>
            <Statistic
              title="交易合同总数"
              value={245}
              prefix={<FileTextOutlined />}
              valueStyle={{ color: '#00479d' }}
            />
          </Card>
        </Col>
      </Row>

      <div className="section-container">
        <h3 className="section-title">最近动态</h3>
        <Card>
          <p>暂无动态数据</p>
        </Card>
      </div>
    </div>
  );
};

export default Overview; 